import React, { Fragment } from 'react'
import { Text, ScrollView } from 'react-native'
import styles from './css/index'
import BasePage from 'src/pageP/base/base-page/index'
import CompanyTouchableOpacity from '@/pageB/company/mine-company/components/CompanyTouchableOpacity'
import { getCurrentPosition } from 'src/store/actions/landmark'
/* redux */
import { connect } from 'react-redux'
import CustomButton from 'src/components/button/CustomButton'
import NavigationUtil from 'src/utils/NavigationUtil'

@connect(({ landmark }) => ({
  landmark
}))
class BusinessAddress extends BasePage {
  constructor(props) {
    super(props)
    this.state = {
      visible: false,
      header: {
        headerBg: 'transparent'
      },
      item: {
        cityname: '',
        pname: '',
        adname: ''
      },
      businessAddress: '',
      addressDetail: '',
      isDel: false
    }
  }

  isDel = ({ visible }) => {
    this.setState({
      visible
    })
  }

  getData = item => {
    this.setState({
      item
    })
  }

  getMapView = () => {
    const { item, isDel } = this.state
    if (!isDel) {
      this.props.navigation.navigate('CompanyMapView', {
        getData: this.getData,
        jump: 'BusinessAddress',
        location: item.location || ''
      })
    }
  }

  prewClick = () => {
    const {
      navigation: {
        state: {
          params: { getData, companyId }
        }
      }
    } = this.props
    const {
      item: { pname, cityname, adname, location, name, address },
      addressDetail
    } = this.state
    const data = {
      areaProvince: pname,
      areaCity: cityname,
      addressArea: adname,
      addressDetail: address,
      addressSimple: name,
      roomInfo: addressDetail
    }
    if (location) {
      data.lat = location.split(',')[1]
      data.lng = location.split(',')[0]
    } else {
      data.lat = undefined
      data.lng = undefined
    }
    getData(data, data, (data) => {
      if (!data) {
        NavigationUtil.goBack()
      }
    }, companyId, this.state.item)
  }

  jumpFn = () => {
    if (!this.state.isDel) {
      const saveCallback = postion => {
        this.setState({
          addressDetail: postion
        })
      }
      this.props.navigation.navigate('CommonInputPage', {
        title: '门牌号',
        desc: '*不能填联系方式以及特殊符号',
        placeholder: '请输入门牌号',
        maxLength: 100,
        value: '',
        saveCallback
      })
    }
  }

  componentDidMount() {
    const {
      navigation: {
        state: { params }
      }
    } = this.props
    if (
      this.props.navigation.state.params &&
      this.props.navigation.state.params.data
    ) {
      this.setState({
        item: {
          ...params.data,
          pname: params.data.areaProvince || '',
          cityname: params.data.areaCity || '',
          adname: params.data.addressArea || '',
          location: params.data.lat > 0 && params.data.lng + ',' + params.data.lat,
          address: params.data.address || '',
          name: params.data.addressSimple || ''
        },
        addressDetail: params.data.roomInfo
      })
    }
  }

  childRender() {
    const { addressDetail, item } = this.state
    const {
      navigation: {
        state: { params }
      }
    } = this.props
    return (
      <ScrollView contentContainerStyle={styles.container}>
        <Text style={styles.businessAddress}>{params.title}</Text>
        <CompanyTouchableOpacity
          ellipsizeMode="tail"
          valueStyle={styles.valueStyle}
          numberOfLines={1}
          onPress={this.getMapView}
          value={
            item.name || ''
          }
          url={require('src/imgC/company/icon_right.png')}
          style={styles.companyTouchableOpacity}
          title="地址"
        />
        <CompanyTouchableOpacity
          onPress={this.jumpFn}
          valueStyle={styles.valueStyle}
          value={addressDetail || ''}
          url={require('src/imgC/company/icon_right.png')}
          title="门牌"
        />
        {/* {isDel && (
          <CustomButton
            onPress={this.isDel}
            params={{ visible: true }}
            style={styles.delView}
          >
            <Text style={styles.delText}>删除</Text>
          </CustomButton>
        )} */}
      </ScrollView>
    )
  }

  renderNavigationBarChild = () => {
    return (
      <CustomButton style={[styles.naviBtnBG]} onPress={this.prewClick}>
        <Text>保存</Text>
      </CustomButton>
    )
  }
}

export default BusinessAddress
